<template>
    <div class="weui-search-bar weui-search-bar-focusing" id="searchBar">
            <div class="weui-search-bar__form">
                <div class="weui-search-bar__box">
                    <i class="weui-icon-search"></i>
                    <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索名称" required="" v-model="condition" @keyup.enter.stop.prevent="getFilterData" @change="getData">
                    <a href="javascript:" class="weui-icon-clear" id="searchClear" @click="searchClear"></a>
                </div>
            </div>
        </div>
</template>
<script>
    export default {
        data(){
            return {
                condition: ""
            }
        },
        methods: {
            searchClear(){
               this.condition = "";
               this.$store.dispatch("getList");
            },
            getData(){
                if (!this.condition) {
                     this.$store.dispatch("getList");
                }
            },
            getFilterData(){
                this.$store.dispatch("getFilter", this.condition);
            }
        }
    }
</script>
<style>
.weui-search-bar {
}
</style>